﻿var Bianyuan = {
//添加事件2(DOM-保证this指向对象是obj)
addEvent : function(obj, type, fn){
if (obj.attachEvent){
obj['e'+type+fn] = fn;
obj[type+fn] = function(){obj['e'+type+fn](window.event);}
obj.attachEvent('on'+type, obj[type+fn]);
}else{
obj.addEventListener(type, fn, false);
}
},
//获取id元素
$ : function(id){
return document.getElementById(id);
},
//取得浏览器可视区size
getBrowserSize : function(){
var pageWidth = window.innerWidth,
pageHeight = window.innerHeight;
if (typeof pageWidth != "number"){
if (document.compatMode == "CSS1Compat"){
pageWidth =  document.documentElement.clientWidth;
pageHeight =  document.documentElement.clientHeight;
} else{
pageWidth =  document.body.clientWidth;
pageWidth =  document.body.clientHeight;
}
}
//ie减去17滚动条宽度
if(!window.ActiveXObject){
pageWidth -= 17;
}
return {
width : pageWidth,
height : pageHeight
}
},
//获取滚动条高度
getPageScroll : function(){
var yScroll;
if (self.pageYOffset) {
yScroll = self.pageYOffset;
} else if (document.documentElement && document.documentElement.scrollTop){
yScroll = document.documentElement.scrollTop;
} else if (document.body) {
yScroll = document.body.scrollTop;
}
return yScroll;
}
}
function scrollBar(scrollId, dir, headHeight, footHeight, areaWidth, o){
//滚动框宽高
var scrollBar = Bianyuan.$(scrollId),
barWidth = scrollBar.offsetWidth,
barHeight = scrollBar.offsetHeight;
//可视区宽高
var pageWidth = Bianyuan.getBrowserSize().width,
pageHeight = Bianyuan.getBrowserSize().height;
//内容宽高
var widthMore = document.documentElement.scrollWidth,
heightMore = document.body.scrollHeight||(document.documentElement.scrollHeight);
//最大宽高
var maxWidth = Math.max(pageWidth, widthMore),
maxHeight = Math.max(pageHeight, heightMore);
scrollBar.style.position = 'absolute';
//设置top--假设滚动框高度小于整个页面高度，如果大于直接将其隐藏
if (maxHeight < (barHeight + footHeight + footHeight + 4)){
scrollBar.style.display = 'none';
}else{
//不挡顶部---如果想改距顶高度，改下边的第一个2值
scrollBar.style.top = Bianyuan.getPageScroll() + headHeight + 2 + 'px';
//不挡底部
if ((heightMore - Bianyuan.getPageScroll() - barHeight) <= footHeight){
scrollBar.style.top = heightMore - footHeight - barHeight - 2 + 'px';
}
}
//无视主体内容-左右
if (dir == 'left' && areaWidth == 1){
scrollBar.style.left = 2 + 'px';
}else if (dir == 'right' && areaWidth == 1){
scrollBar.style.left = maxWidth - barWidth - 2 + 'px';
//根据主体内容宽-左右
}else if (dir == 'left' && areaWidth != 1){
if (pageWidth >= (barWidth*2 + areaWidth + 4)){
scrollBar.style.left = (pageWidth - areaWidth)/2 - barWidth - 2 + 'px';
}else{
scrollBar.style.left = 2 + 'px';
}
}else if (dir == 'right' && areaWidth != 1){
if (pageWidth >= (barWidth*2 + areaWidth + 4)){
scrollBar.style.left = (pageWidth - areaWidth)/2 + areaWidth + 2 + 'px';
}else{
scrollBar.style.left = maxWidth - barWidth - 2 + 'px';
}
}
//关闭和返回顶部
if (o){
if (o.btnClose){
var closeBtn = Bianyuan.$(o.btnClose);
Bianyuan.addEvent(closeBtn, 'click', function(){
scrollBar.style.display = 'none';
})
}
if (o.goTop){
var gotopBtn = Bianyuan.$(o.goTop);
Bianyuan.addEvent(gotopBtn, 'click', function(){
document.documentElement.scrollTop = 0;
document.body.scrollTop = 0;
})
}
}
//改变窗口大小或滚动条滚动
resizeWindow(scrollId, dir, headHeight, footHeight, areaWidth, o);
}
function resizeWindow(scrollId, dir, headHeight, footHeight, areaWidth, o){
window.onresize = function(){scrollBar(scrollId, dir, headHeight, footHeight, areaWidth, o);}
window.onscroll = function(){scrollBar(scrollId, dir, headHeight, footHeight, areaWidth, o);}
}


var str = "";
str += '<div id=\"scroll_div\" style=\"width:30px; height:120px; background:url(http://product.emoney.cn/images/images/product_tell.png) no-repeat;\">';
str += '<div  style=\"height:37px; margin:2px; cursor:pointer; position:relative;\" id=\"div_btn01\">';
str += '<div  id=\"div_btn01_1\"  style=\"width:190px; height:306px; position:absolute;left:-191px;display:none; overflow:hidden; top:-2px;\">';
str += '<iframe src=\"http://product.emoney.cn/kfPage.html\" frameborder=\"0\" width=\"190\" height=\"306\"></iframe>';
str += '</div>';
str += '</div>';
str += ' <div class=\"div_btn02\"  id=\"div_btn02\" style=\"height:35px;\">';
str += ' <div  id=\"div_btn01_2\"  style=\"width:190px; height:300px; position:absolute;left:-189px;display:none; overflow:hidden; top:0px;\">';
str += '<iframe src=\"http://product.emoney.cn/kfPage2.html\" frameborder=\"0\" width=\"190\" height=\"300\"></iframe>';
str += '</div>';
str += ' </div>';
str += ' <div class=\"div_btn01\" id=\"div_btn03\" style=\"height:40px;\">';
str += ' <div  id=\"div_btn01_3\" style=\"width:190px;  height:276px;height:260px\9; position:absolute;left:-189px;display:none; overflow:hidden;top:0px\">';


str += '<iframe src=\"http://product.emoney.cn/kfPage3.html\" frameborder=\"0\" width=\"194\" height=\"276px\" ></iframe>';
str += '</div>';
str += ' </div>';
str += '</div>';
document.write(str); 


$("#div_btn01").hover(function () {
    $("#div_btn01_1").show();
}, function () {
    $("#div_btn01_1").hide();
});
$("#div_btn02").hover(function () {
    $("#div_btn01_2").show();
}, function () {
    $("#div_btn01_2").hide();
});
$("#div_btn03").hover(function () {
    $("#div_btn01_3").show();
}, function () {
    $("#div_btn01_3").hide();
});

